@use "var.scss" as *;
@use "global.scss" as *;

.info {
    padding-bottom: 1.5rem;

    /* 30px -> 1.5rem */
    .title {
        height: 3.125rem;
        /* 50px -> 3.125rem */
        line-height: 3.125rem;
        padding-left: 1.25rem;
        /* 20px -> 1.25rem */
        font-size: 1.25rem;
        /* 20px -> 1.25rem */
        font-weight: 600;
        //color: $color-black;
    }

    .night-mode .title-text {
        color: #fff !important;
    }

    hr {
        width: 98%;
    }

    .personal {
        padding-right: 2.5rem;
        /* 50px -> 2.5rem */
        padding-top: 2rem;
        /* 40px -> 2rem */
    }

    .btn {
        width: 100%;
        height: 2.5rem;
        /* 40px -> 2.5rem */
        margin-left: 2.5rem;
        /* 40px -> 2.5rem */
        @include layout(center, center);
        cursor: pointer;

        div {
            display: inline-block;
            width: 6.25rem;
            /* 100px -> 6.25rem */
            height: 1.875rem;
            /* 30px -> 1.875rem */
            line-height: 1.875rem;
            text-align: center;
            background-color: $color-blue-active;
            margin: 0 1.25rem;
            /* 20px -> 1.25rem */
            color: $color-white;
        }
    }
}

hr {
    border: none;
    height: 0.1rem;
    background-image: linear-gradient(to right, skyblue, #c9ba9b, #cda0c7);
    margin: 1.25rem;
}
